<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>服务页面</title>
</head>
<body>
<label for="token">
    token:
    <input type="text" id="token"/>
</label>
<label for="data">
    data:
    <textarea id="data" rows="10" cols="50"></textarea>
</label>
<!-- data 预览 -->
<div id="data-preview">
</div>
</body>
<script>
    // 读取本地 localStorage
    let token = localStorage.getItem('token');
    console.log(token);
    document.getElementById('token').value = token;
    let data = fetch(
        '/addons/cxdx/service/read',
        {
            method: 'POST',
            body: JSON.stringify(
                {
                    'token': token
                }
            )
        }
    )
        .then((result) => result.json())
        .then(
            (result) => {
                console.log(result);
                document.getElementById('data').value = JSON.stringify(result);
                let dataPreview = document.getElementById('data-preview');
                for (let i = 0; i < result.count; i++) {
                    // 生成预览 html
                    let dataPreviewContent = document.createElement('div');
                    // 生成图片
                    let dataPreviewImage = document.createElement('img');
                    dataPreviewImage.src = result.list[i].qrcode;
                    dataPreviewImage.style.width = '100px';
                    dataPreviewImage.style.height = '100px';
                    dataPreviewContent.append(dataPreviewImage);
                    // 生成 优惠券ID 显示
                    let couponIdSpan = document.createElement('p');
                    couponIdSpan.innerText = "优惠券ID: " + result.list[i].couponId;
                    dataPreviewContent.append(couponIdSpan);
                    // 生成 失效时间 显示
                    let dateToSpan = document.createElement('p');
                    dateToSpan.innerText = "失效时间: " + result.list[i].dateTo;
                    dataPreviewContent.append(dateToSpan);
                    // 添加到预览
                    dataPreview.append(dataPreviewContent);
                }
            }
        )
        .catch(
            (err) => {
                console.log(err)
            }
        )
</script>
</html>